$(function () {
  getList()
  function getList() {
    $.ajax({
      // url: 'http://localhost:8080/api/v1/admin/category/list',
      url: '/admin/category/list',
      // headers: { Authorization: localStorage.getItem('token')},
      success: res => {
        if (res.code == 200) {
          // console.log(res);
          let temp = template('list', res)
          $('tbody').html(temp)
        }
      }
    })
  }

// 清空input的值和清空id值
  function clear() {
    $('[name="name"]').val("")
    $('[name="slug"]').val("")
  }


  // 1、给新增按钮添加点击事件，显示模态框
  $('#xinzengfenlei').on('click', function () {
    // 显示模态框
    $('#myModal').modal()
  })

  //2、 给编辑按钮添加点击事件
  $('tbody').on('click', '.btn-e', function () {
    // 设置隐藏框的id值
    $('[type="hidden"]').attr('id', $(this).attr('data-id'))
    // 显示模态框
    $('#myModal').modal()
    // 获取tr的文本
    let name = $(this).parents('tr').find('td').eq(0).text()
    let slug = $(this).parents('tr').find('td').eq(1).text()
    // 给模态框的表单设置值
    $('[name="name"]').val(name)
    $('[name="slug"]').val(slug)
  })
  // 给保存按钮添加点击事件
  $('.btn_opt').on('click', e => {
    e.preventDefault()
    let id = $('[type="hidden"]').attr('id')
    let name = $('[name="name"]').val()
    let slug = $('[name="slug"]').val()
    console.log(name, slug, id);
    //2.1 编辑
    if (id) {
      $.ajax({
        type: 'post',
        // url: 'http://localhost:8080/api/v1/admin/category/edit',
        url: '/admin/category/edit',
        data: {
          id,
          name,
          slug
        },
        // headers: { Authorization: localStorage.getItem('token') },
        success: res => {
          if (res.code == 200) {
            // 清空input里的值和清空隐藏框的id
            $('[type="hidden"]').attr('id', "")
            // $('[name="name"]').val("")
            // $('[name="slug"]').val("")
            clear()
            // 提示框
            layer.msg(res.msg)
            // 隐藏模态框
            $('#myModal').modal('hide')
            // 重新请求数据渲染页面
            getList()

          } else if (res.code == 400) {
            layer.msg('修改的内容不能和原内容一样')
          }

        }
      })
    } else {
      // 新增
      $.ajax({
        type: 'post',
        // url: 'http://localhost:8080/api/v1/admin/category/add',
        url: '/admin/category/add',
        data: {
          name,
          slug
        },
        // headers: { Authorization: localStorage.getItem('token') },
        success: res => {
          console.log(res);
          if (res.code == 200) {
            layer.msg(res.msg)
            // 隐藏模态框
            $('#myModal').modal('hide')
            // 重新请求数据渲染页面
            getList()
          } else {
            layer.msg(res.msg)
          }
        }
      })
    }
  })
  // 给取消按钮添加点击事件
  $('.btn-qx').on('click', function () {
    // 清空input的值和清空id值
    $('[type="hidden"]').attr('id', "")
   clear()
  })
  // 给X按钮添加点击事件
  $('.close').on('click', function () {
    // 清空input的值和清空id值
    $('[type="hidden"]').attr('id', "")
   clear()
  })



   // 删除
   $('tbody').on('click', 'a.btn-d', function (e) {
    e.preventDefault()
    let id = $(this).attr('data-id')

    console.log(id);
    if (confirm('确定要删除吗？')) {
      $.ajax({
        type: 'post',
        // url: 'http://localhost:8080/api/v1/admin/category/delete',
        url: '/admin/category/delete',
        data: { id },
        // headers: { Authorization: localStorage.getItem('token') },
        success: res => {
          console.log(res);
          if (res.code == 200) {
            layer.msg(res.msg)
            $(this).parent().parent().remove()
          }
        }
      })
    }

  })

  /*
  // 新增文章类别
  $('#xinzengfenlei').on('click', function () {
    // 显示模态框
    $('#myModal').modal()
    // 给保存按钮添加点击事件，发送ajax请求
    $('.btn_opt').on('click', e => {
      // 阻止默认行为
      e.preventDefault()
      // 获取用户填写的信息
      const name = $('[name="name"]').val().trim()
      const slug = $('[name="slug"]').val().trim()
      // 发送ajax请求【新增文章类别】
      $.ajax({
        type: 'post',
        url: 'http://localhost:8080/api/v1/admin/category/add',
        data: {
          name,
          slug
        },
        headers: {
          Authorization: localStorage.getItem('token')
        },
        success: res => {
          // console.log(res);
          if (res.code == 200) {
            // 清空input框中的数据
            $('[name="name"]').val('')
            $('[name="slug"]').val('')
            // 让模态框隐藏
            $('#myModal').modal('hide')
            getList()
          } else {
            // 使用layer框架的提示框
            layer.msg(res.msg)
          }
        }

      })
    })
  })
  // 编辑文章类别
  $('tbody').on('click', 'a.btn-e', function () {
    // 显示模态框
    $("#myModal").modal()
    let id = $(this).attr('data-id')
    const name = $(this).parents('tr').find('td').eq(0).text()
    const slug = $(this).parents('tr').find('td').eq(1).text()
    $('[name="name"]').val(name)
    $('[name="slug"]').val(slug)

    $('.btn_opt').on('click', e => {
      e.preventDefault()
      $.ajax({
        type: 'post',
        url: 'http://localhost:8080/api/v1/admin/category/edit',
        data: {
          name,
          slug,
          id
        },
        headers: { Authorization: localStorage.getItem('token') },
        success: res => {
          if (res.code == 200) {
            layer.msg(res.msg)
            // 清空input框中的数据
            $('[name="name"]').val('')
            $('[name="slug"]').val('')
            // 隐藏模态框
            $('#myModal').modal('hide')
          } else if (res.code == 400) {
            layer.msg('修改失败')
          }
        }
      })
    })
    $('#myModal').on('click','.close' ,function () {
      // 清空input框中的数据
      $('[name="name"]').val('')
      $('[name="slug"]').val('')
      console.log(6666);
    })
  })
  // 删除
  $('tbody').on('click', 'a.btn-d', function (e) {
    e.preventDefault()
    let id = $(this).attr('data-id')

    console.log(id);
    if (confirm('确定要删除吗？')) {
      $.ajax({
        type: 'post',
        url: 'http://localhost:8080/api/v1/admin/category/delete',
        data: { id },
        headers: { Authorization: localStorage.getItem('token') },
        success: res => {
          console.log(res);
          if (res.code == 200) {
            layer.msg(res.msg)
            $(this).parent().parent().remove()
          }
        }
      })
    }

  })
  */



})